<template>
  <!-- 模板部分保持不变 -->
  <div id="user">
    <h1 style="font-size: 16px;">用户中心</h1>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column label="用户头像" width="200">
        <template #default="scope">
          <img :src="scope.row.user_url" alt="用户头像" style="width: 100px; height: 100px;border-radius: 50%;">
        </template>
      </el-table-column>
      <el-table-column prop="user_wxname" label="用户昵称" width="150" />
      <!-- <el-table-column prop="comment_num" label="评论数" width="150" /> -->
      <el-table-column  label="评论数" width="150">
          <template #default="scope">
            <div style="height: 150px;line-height:150px;" @click="getUserComments(scope.row.open_id)">{{ scope.row.comment_num }}</div>
          </template>
        </el-table-column>
      <el-table-column label="订阅数" width="150">
        <template #default="scope">
            <div style="height: 150px;line-height:150px;" @click="getUserSubscribes(scope.row.open_id)">{{ scope.row.subscribe_num }}</div>
          </template>
      </el-table-column>
    </el-table>
  </div>
  <div>
    <comments-dialog v-model:commentsDialog="commentsDialog" :open-id="commentsOpenId"/>
    <subscribes-dialog v-model:subscribesDialog="subscribesDialog" :open-id="subscribesOpenId"/>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import api from "../../api/api"
import CommentsDialog from './CommentsDialog.vue'
import SubscribesDialog from './SubscribesDialog.vue'

const tableData = ref([])

onMounted(async() => {
  getAllUser()
})

function getAllUser() {
  api.get('/getAllUser')
    .then(response => {
      tableData.value = response.data
      // console.log("值：",tableData.value)
    })
    .catch(error => {
      console.error('请求失败:', error)
    })
}
const commentsDialog = ref(false)
const commentsOpenId = ref('') 
function getUserComments(open_id){
  // alert(open_id)
  commentsOpenId.value = open_id
    commentsDialog.value = true
}
const subscribesDialog = ref(false)
const subscribesOpenId = ref('') 
function getUserSubscribes(open_id){
  // alert(open_id)
  subscribesOpenId.value = open_id
  subscribesDialog.value = true
}
</script>